<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>帮助手册</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <link rel="shortcut icon" href="/favicon.ico">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="./css/sm.min.css">
    <link rel="stylesheet" href="./css/sm-extend.min.css">
    <link rel="stylesheet" type="text/css" href="./css/mystyle.css">
</head>

<body>
    <!--页面组,留不留待定-->
    <div class="page-group">
        <!-- 单个page ,第一个.page默认被展示-->
        <div class="page">
            <!-- 标题栏 -->
            <header class="bar bar-nav">
                <a class="icon icon-app pull-left open-panel"></a>
                <h1 class="title">帮助文档</h1>
            </header>
            <!--这里是搜索框-->
            <div class="bar bar-header-secondary">
                <div class="searchbar">
                    <a class="searchbar-cancel">取消</a>
                    <div class="search-input">
                        <label class="icon icon-search" for="search"></label>
                        <input type="search" id='search' placeholder='输入关键字...' />
                    </div>
                </div>
            </div>
            <!-- 这里是页面内容区 -->
            <div class="content">
                <div class="content-block">帮助列表的详细解答</div>
            </div>
        </div>
        <!-- 其他的单个page内联页（如果有） -->
        <div class="page">...</div>
    </div>
    <!--这是侧栏区-->
    <div class="panel panel-left panel-reveal theme-white">
        <div class="content-block">
            <div>
                <H3 style="display: inline-block;">常见问题列表</H3>
                <label class="icon icon-browser" style="margin-left: 1rem;"></label>
            </div>
            <!-- <hr> -->
            <!--问题列表区-->
            <div class="list-block" style="margin-top: 1rem;">
                <ul>
                    <li class="item-content item-link" id="FAQ_1">
                        <!-- <div class="item-media"><i class="icon icon-f7"></i></div> -->
                        <div class="item-inner">
                            <div class="item-title">如何新建排班</div>
                        </div>
                    </li>
                    <li class="item-content item-link" id="FAQ_2">
                        <!-- <div class="item-media"><i class="icon icon-f7"></i></div> -->
                        <div class="item-inner">
                            <div class="item-title">如何选择历史</div>
                        </div>
                    </li>
                    <div style="padding-top: 3rem;">
                        <hr>
                    <li class="item-content item-link" id="FAQ_2">
                        <!-- <div class="item-media"><i class="icon icon-f7"></i></div> -->
                        <div class="item-inner">
                            <div class="item-title">名词解释</div>
                        </div>
                    </li>
                    </div>
                </ul>
            </div>
        </div>
    </div>
    <!-- 默认必须要执行$.init(),实际业务里一般不会在HTML文档里执行，通常是在业务页面代码的最后执行 -->
    <!--<script>$.init()</script>-->
    <script type='text/javascript' src='./js/zepto.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='./js/sm.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='./js/sm-extend.min.js' charset='utf-8'></script>
    <script type="text/javascript" src="js/myscript.js" charset="UTF-8"></script>
</body>

</html>